<template>
  <div class="index">
    <div>
      <el-date-picker
        v-model="startTime"
        type="datetime"
        placeholder="选择开始时间"
        value-format="yyyy-MM-dd HH:mm"
        format="yyyy-MM-dd HH:mm"
      >
      </el-date-picker>
      <el-button size="small" type="primary" @click="choose()">确认</el-button>
      <el-button size="small" type="primary" @click="goBack()"
        >当前时间</el-button
      >
    </div>
    <div>
      <div class="nowYear">{{ nowTime.trim().split(" ")[0] }}</div>
      <div class="nowTimeDetail">{{ nowTime.trim().split(" ")[1] }}</div>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      startTime: "", //存储绑定picker组件选择的时间
      nowTime: "", //用于展示
      timers: "", //自定义时间定时器
      timer: "", //当前系统时间定时器
      isNowTime: true, //是否选择了自定义时间的号状态
    };
  },
  methods: {
    // 实时获取当前系统时间
    getTime() {
      clearInterval(this.timers);
      this.timer = setInterval(() => {
        let timeDate = new Date();
        let years = timeDate.getFullYear(); //年
        let month = timeDate.getMonth() + 1; //月
        month = month >= 10 ? month : "0" + month;
        let days = timeDate.getDate(); //日
        days = days >= 10 ? days : "0" + days;
        let hours = timeDate.getHours();
        hours = hours >= 10 ? hours : "0" + hours;
        let minutes = timeDate.getMinutes();
        minutes = minutes >= 10 ? minutes : "0" + minutes;
        let seconds = timeDate.getSeconds();
        seconds = seconds >= 10 ? seconds : "0" + seconds;
        this.nowTime = `${years}-${month}-${days} ${hours}:${minutes}:${seconds}`;
      }, 1000);
    },
    // 获取选择的开始时间
    getHistoryTime() {
      clearInterval(this.timer); //清除timer定时器
      var that = this;
      this.timers = setInterval(() => {
        let a;
        if (that.isNowTime) {
          a = that.sendTime.startTime;
        } else {
          a = that.nowTime.replaceAll("/", "-");
        }
        let yearAll = a.split(" ")[0];
        let timeAll = a.split(" ")[1];
        // 闰年2月29天，平年2月28天
        // 判断是否为闰年
        let isLeap =
          yearAll.split("-")[0] % 400 == 0 ||
          (yearAll.split("-")[0] % 100 != 0 && yearAll.split("-")[0] % 4 == 0);
        let February = isLeap ? 29 : 28; //计算2月天数
        let str = isLeap ? "闰年，2月29天" : "平年2月28天";
        let bigMonth = [1, 3, 5, 7, 8, 10, 12]; //1个月31天
        let smallMonth = [4, 6, 9, 11]; //1个月30天
        let years = yearAll.split("-")[0]; //年
        let month = yearAll.split("-")[1]; //月
        let days = yearAll.split("-")[2]; //日
        let hours = timeAll.split(":")[0]; //时
        let minutes = timeAll.split(":")[1]; //分
        let seconds = timeAll.split(":")[2]; //秒
        // 秒
        if (Number(seconds) >= 0 && Number(seconds) < 9) {
          seconds = `0${Number(seconds) + 1}`;
        } else if (Number(seconds) >= 9 && Number(seconds) < 59) {
          seconds = Number(seconds) + 1;
        } else if (Number(seconds) >= 59) {
          seconds = "00";
          // 分
          if (Number(minutes) >= 0 && Number(minutes) < 10) {
            minutes = `0${Number(minutes) + 1}`;
          } else if (Number(minutes) >= 10 && Number(minutes) < 59) {
            minutes = Number(minutes) + 1;
          } else if (Number(minutes) >= 59) {
            minutes = "00";
            // 时
            if (Number(hours) >= 0 && Number(hours) < 10) {
              hours = `0${Number(hours) + 1}`;
            } else if (Number(hours) >= 10 && Number(hours) < 23) {
              hours = Number(hours) + 1;
            } else if (Number(hours) <= 23) {
              hours = "00";
              // 天
              // 判断闰年还是平年，大月还是小月
              // 先判断是不是2月份
              if (Number(month) == 2) {
                console.log(February);
                console.log(February - 1);
                if (Number(days) > 0 && Number(days) < 9) {
                  days = `0${Number(days) + 1}`;
                } else if (Number(days) >= 9 && Number(days) < February) {
                  days = Number(days) + 1;
                } else if (Number(days) >= February) {
                  days = "01";
                  if (Number(month) > 0 && Number(month) < 9) {
                    month = `0${Number(month) + 1}`;
                  } else if (Number(month) >= 9 && Number(month) < 11) {
                    month = Number(month) + 1;
                  } else if (Number(month) >= 11) {
                    month = "01";
                    years = Number(years) + 1;
                  }
                }
              } else if (Number(month) != 2) {
                // 判断如果是大月
                if (bigMonth.includes(Number(month))) {
                  if (Number(days) > 0 && Number(days) < 9) {
                    days = `0${Number(days) + 1}`;
                  } else if (Number(days) >= 9 && Number(days) < 31) {
                    days = Number(days) + 1;
                  } else if (Number(days) >= 31) {
                    days = "01";
                    // 月
                    if (Number(month) > 0 && Number(month) < 9) {
                      month = `0${Number(month) + 1}`;
                    } else if (Number(month) >= 9 && Number(month) < 11) {
                      month = Number(month) + 1;
                    } else if (Number(month) >= 11) {
                      month = "01";
                      years = Number(years) + 1;
                    }
                  }
                } else if (smallMonth.includes(Number(month))) {
                  if (Number(days) > 0 && Number(days) < 9) {
                    days = `0${Number(days) + 1}`;
                  } else if (Number(days) >= 9 && Number(days) < 29) {
                    days = Number(days) + 1;
                  } else if (Number(days) >= 29) {
                    days = "01";
                    // 月
                    if (Number(month) > 0 && Number(month) < 9) {
                      month = `0${Number(month) + 1}`;
                    } else if (Number(month) >= 9 && Number(month) < 11) {
                      month = Number(month) + 1;
                    } else if (Number(month) >= 11) {
                      month = "01";
                      years = Number(years) + 1;
                    }
                  }
                }
              }
            }
          }
        }
        that.nowTime = `${years}-${month}-${days} ${hours}:${minutes}:${seconds}`;
      }, 1000);
    },
    // 确认函数
    choose() {
      this.isNowTime = false;
      let time = `${this.startTime}:00`;
      this.nowTime = time;
      clearInterval(this.timers);
      this.getHistoryTime();
    },
    // 回到当前时间
    goBack() {
      this.getTime();
    },
  },
  mounted() {
    this.getTime();
  },
};
</script>
<style lang="scss" scoped>
.index {
  width: 80vw;
  height: 80vh;
  border: 1px solid red;
}
</style>